<!-- 选择添加到哪个广告组 -->

<template>
  <div class="">
    <el-cascader
      :value="value"
      :props="addToProps"
      :size="size"
      :disabled="value.length>5"
      style="width: 300px;"
      @change="handleChange"
    ></el-cascader>
  </div>
</template>
<script>
import {
  findTeamAdgroup // 查询所有的广告系列以及其上级  需要自己做可选处理

} from '@/api/overView'

import {
  findListWords // 查询广告系列下方的广告组
} from '@/api/tool.js'

export default {
  name: '', // ·������
  model: {
    prop: 'value',
    event: 'change'

  },
  props: {
    value: {
      type: Object,
      default: function() {
        return []
      }
    },
    size: {
      type: String,
      default: 'small'
    }
  },
  data() {
    return {
      adList: {},
      valList: [],
      addToProps: { // 添加至广告组的弹窗--级联选择框配置项
        multiple: true, // 多选
        expandTrigger: 'click', // 触发方式
        lazy: true, // 懒加载
        lazyLoad: this.lazyLoad

      }
    }
  },
  computed: {

    opList() {
      if (this.adList) {
        const arr = [{
          value: 'default',
          label: '自助投放',
          disabled: !this.adList.default || !this.adList.default.length,
          children: this.adList.default && this.adList.default.length ? this.returnList(this.adList.default) : []
        }, {
          value: 'secretKeys',
          label: '协同投放',
          disabled: !this.adList.secretKeys || !this.adList.secretKeys.length,
          children: this.adList.secretKeys && this.adList.secretKeys ? this.returnSecretKeysList(this.adList.secretKeys)
            : []
        }]

        return arr
      } else {
        const arr = [{
          value: 'default',
          label: '自助投放',
          disabled: true
        }, {
          value: 'secretKeys',
          label: '协同投放',
          disabled: true
        }]
        return arr
      }
    }
  },
  watch: {
    // obj: { //�����Ķ���
    //   deep: true, //���ȼ�������Ϊ true
    //   // ������wacth��������firstName��������֮��������ȥִ��handler����
    //       immediate: true
    //   handler: function(newV, oldV) {
    //     console.log('watch�У�', newV)
    //   }
    // }
  },
  // ������
  created() {},
  // ���غ�
  mounted() {
    this.findTeamAdgroup()
  },
  // ���ٺ�
  destroyed() {

  },

  // ����
  methods: {
    handleChange(val) {
      const addList = val.filter(item => {
        if (item[0] === 'default') {
          return item.length > 2
        } else {
          return item.length > 3
        }
      })
      let value = []
      if (addList.length > 5) {
        this.$message.error('广告组选择不能超过5个')
        value = addList.slice(0, 5)
      } else {
        value = addList
      }
      this.$emit('change', value)
    },

    async lazyLoad(node, resolve) {
      // console.log(node, 'niahow32')

      if (!node.level) {
        // 点击第一层
        const res = await this.findTeamAdgroup()
        // const nodes = [
        //   {
        //   label: '自助投放',
        //   value: 'default',
        //   isData: true,
        //   disabled: !res.default || !res.default.length,
        //   children: res.default.map(item => {
        //     return {
        //       label: item.name,
        //       value: item.id,
        //       disabled: !item.campaignList.length,
        //       isData: true,
        //       children: item.campaignList.map(ca => {
        //         const index = ca.name.indexOf('_3YData_')
        //         const label = ca.name.substring(index + 8)
        //         return {
        //           label: label,
        //           value: ca.campaignId,
        //           isCa: true
        //         }
        //       })
        //     }
        //   })
        // },
        // {
        //   label: '协同投放',
        //   value: 'secretKeys',
        //   isData: true,
        //   disabled: !res.secretKeys || !res.secretKeys.length,
        //   children: res.secretKeys.map(item => {
        //     return {
        //       label: item.secretName,
        //       value: item.uuid,
        //       disabled: !item.org.length,
        //       isData: true,
        //       children: item.org.map(org => {
        //         return {
        //           label: org.orgName,
        //           value: org.orgId,
        //           disabled: !(org.campaignsOrAppInfoList && org.campaignsOrAppInfoList.length),
        //           isData: true,
        //           children: !(org.campaignsOrAppInfoList && org.campaignsOrAppInfoList.length) ? [] : org
        //             .campaignsOrAppInfoList.map((ca) => {
        //               return {
        //                 label: ca.name,
        //                 value: ca.campaignId,
        //                 isCa: true

        //               }
        //             })
        //         }
        //       })
        //     }
        //   })

        // }
        // ]
        const nodes = res.secretKeys.map(item => {
            return {
              label: item.secretName,
              value: item.uuid,
              disabled: !item.org.length,
              isData: true,
              children: item.org.map(org => {
                return {
                  label: org.orgName,
                  value: org.orgId,
                  disabled: !(org.campaignsOrAppInfoList && org.campaignsOrAppInfoList.length),
                  isData: true,
                  children: !(org.campaignsOrAppInfoList && org.campaignsOrAppInfoList.length) ? [] : org
                    .campaignsOrAppInfoList.map((ca) => {
                      return {
                        label: ca.name,
                        value: ca.campaignId,
                        isCa: true
                      }
                    })
                }
              })
            }
          })
        resolve(nodes)
      } else if (node.data.isData) {
        resolve(node.data)
      } else if (node.data.isCa) {
        const arr = await this.findGroupList(node)
        resolve(arr)
      } else {
        resolve([])
      }
    },

    async findGroupList(data) {
      // return console.log(data, '你好')
      const query = {
        currencyType: this.$store.state.user.unit,
        teamId: this.$store.state.team.teamId,
        campaignId: data.pathNodes[data.pathNodes.length - 1].value
      }
      if (data.pathNodes[0].label === '自助投放') {
        query.uuid = ''
        query.orgId = ''
      } else {
        query.uuid = data.pathNodes[0].value
        query.orgId = data.pathNodes[1].value
      }

      const res = await findListWords({ ...query
      })
      if (res.data.code * 1 === 20000 && res.data.flag) {
        const arr = res.data.data.map(item => {
          return {
            label: item.name,
            value: item.adGroupId,
            disabled: item.keyWordsSize >= 5000,
            leaf: true

          }
        })
        if (arr.length) {
          return arr
        } else {
          return [{
            label: '暂无广告组可选择',
            value: 0,
            disabled: true,
            leaf: true
          }]
        }
      } else {
        return [{
          label: '暂无广告组可选择',
          value: 0,
          disabled: true,
          leaf: true
        }]
      }
    },

    async findTeamAdgroup() {
      try {
        const res = await findTeamAdgroup({
          teamId: this.$store.state.team.teamId || ''
        })
        if (res.data.code * 1 === 20000) {
          return res.data.data
        } else {
          return {}
        }
        // console.log(res, '你好这是所有广告组的结果')
      } catch (err) {
        return {}
      }
    },

    // 计算自助投放的
    returnList(data) {
      // 计算广告系列组那一层
      const arr = data.map(item => {
        if (item.campaignList && item.campaignList.length) {
          // 计算广告系列那一层
          //
          const caList = item.campaignList.map(caItem => {
            if (caItem.adgroupsList && caItem.adgroupsList.length && caItem.adchannelType === 'SEARCH') {
              // 计算广告组那一层
              const adList = caItem.adgroupsList.map(adItem => {
                return {
                  value: adItem.adGroupId,
                  label: adItem.name,
                  disabled: adItem.keyWordsSize * 1 >= 5000
                }
              })
              const labelIndex = caItem.name.indexOf('_3YData_')
              const label = caItem.name.slice(labelIndex + 8)

              return {
                value: caItem.campaignId,
                label,
                disabled: adList.every(item2 => {
                  return item2.disabled
                }),
                children: adList
              }
            } else {
              const labelIndex = caItem.name.indexOf('_3YData_')
              const label = caItem.name.slice(labelIndex + 8)
              return {
                value: caItem.campaignId,
                label,
                disabled: true
              }
            }
          })
          return {
            value: item.id,
            label: item.name,
            disabled: caList.every(item1 => {
              return item1.disabled
            }),
            children: caList
          }
        } else {
          return {
            value: item.id,
            label: item.name,
            disabled: true
          }
        }
      })
      return arr
    },
    // 计算协同投放的
    returnSecretKeysList(data) {
      // 计算广告系列组那一层
      const arr = data.map(item => {
        if (item.campaignList && item.campaignList.length) {
          // 计算广告系列那一层
          //
          const caList = item.campaignList.map(caItem => {
            if (caItem.adgroupsList && caItem.adgroupsList.length && caItem.adchannelType === 'SEARCH') {
              // 计算广告组那一层
              const adList = caItem.adgroupsList.map(adItem => {
                return {
                  value: adItem.adGroupId,
                  label: adItem.name,
                  disabled: adItem.keyWordsSize * 1 >= 5000
                }
              })
              const labelIndex = caItem.name.indexOf('_3YData_')
              const label = caItem.name.slice(labelIndex + 8)

              return {
                value: caItem.campaignId,
                label,
                disabled: adList.every(item2 => {
                  return item2.disabled
                }),
                children: adList
              }
            } else {
              const labelIndex = caItem.name.indexOf('_3YData_')
              const label = caItem.name.slice(labelIndex + 8)
              return {
                value: caItem.campaignId,
                label,
                disabled: true
              }
            }
          })
          return {
            value: item.id,
            label: item.name,
            disabled: caList.every(item1 => {
              return item1.disabled
            }),
            children: caList
          }
        } else {
          return {
            value: item.id,
            label: item.name,
            disabled: true
          }
        }
      })
      return arr
    }

  }
}
</script>

<style scoped>
</style>
